<div class="col-xxs-12 col-xs-6 col-sm-6 col-md-4">
  <div class="card-pf">
    <div class="card-pf-body card-pf-body-with-version">
      <div class="card-pf-details">
        <div class="card-pf-title-with-icon">
          <custom-icon resource="imageStream" kind="image" tag="is.tag.tag" class="image-icon"></custom-icon>
          <h2 class="card-pf-title">
            <span ng-bind-html="imageStream | displayName | highlightKeywords : keywords"></span>
          </h2>
        </div>
        <p class="card-pf-badge">Builds source code</p>
        <p>
          <truncate-long-text
            class="project-description"
            content="imageStream | imageStreamTagAnnotation : 'description' : is.tag.tag"
            limit="200"
            highlight-keywords="keywords"
            use-word-boundary="true"></truncate-long-text>
        </p>
        <p ng-if="imageStream | imageStreamTagAnnotation : 'provider' : is.tag.tag">
          Provider: {{imageStream | imageStreamTagAnnotation : 'provider' : is.tag.tag}}
        </p>
        <!-- Only show the namespace if it's not in the shared openshift namespace -->
        <p ng-if="imageStream.metadata.namespace !== 'openshift'">
          Namespace: {{imageStream.metadata.namespace}}
        </p>
      </div>
      <p class="card-pf-version">
        Version
        <ui-select ng-model="is.tag" search-enabled="false">
          <ui-select-match>
            <span>
              {{$select.selected.tag}}
              <small ng-repeat="otherTag in referencedBy[$select.selected.tag]">
                <span ng-if="$first"> &mdash; </span>{{otherTag}}<span ng-if="!$last">,</span>
              </small>
            </span>
          </ui-select-match>
          <ui-select-choices repeat="tag in tags track by tag.tag">
            {{tag.tag}}
            <small ng-repeat="otherTag in referencedBy[tag.tag]">
              <span ng-if="$first"> &mdash; </span>{{otherTag}}<span ng-if="!$last">,</span>
            </small>
          </ui-select-choices>
        </ui-select>
      </p>
    </div>
    <div class="card-pf-footer clearfix">
      <a class="btn btn-default pull-right" ng-href="{{imageStream | createFromImageURL : is.tag.tag : project}}">
        Select
      </a>
    </div>
  </div>
</div>
